import React,{useEffect,useState} from 'react';
import {
    SafeAreaView,
    StyleSheet,
    ScrollView,
    View,
    Text,
    StatusBar,
    TouchableOpacity,
    Image
} from 'react-native';


import screen from '../utils/screen';
import Images from '../images/Images';
import {FontFamily, getffly} from '../utils/common';

export default ({title,navigation})=>{



    useEffect(()=>{


    },[])

    return (
        <View style={{height:54 + screen.statusBarHeight,width:'100%'}}>
            <View style={styles.container}>
                <TouchableOpacity
                    style={styles.item}
                    onPress={()=>{
                        navigation.goBack()
                    }}
                >
                    <Image source={Images.back}
                           style={styles.backImg}
                           resizeMode={'contain'}
                    />
                </TouchableOpacity>

                <Text style={styles.title}>{title}</Text>

                <View style={styles.item}/>
            </View>
        </View>
    )
}

const styles= StyleSheet.create({
    container:{
        flex:1,
        marginTop:screen.statusBarHeight,
        flexDirection:'row',
        justifyContent:'space-between',
        alignItems:'center',

    },
    item:{
        width:50,height:50,justifyContent: 'center',alignItems: 'center'
    },
    backImg:{
        width:screen.PIXEL_30,height:screen.PIXEL_30
    },
    title:{
        color:'#377C74',fontSize:19,fontWeight:'500',fontFamily:getffly(FontFamily.medium)
    }
})
